@wrapper-height: 100vh;
@scrollview-height: calc(@wrapper-height - 10px);
@scrollbar-height: 10px;
@scrollbar-width: 5px;
@scrollbar-color: #999;

page {
  background-color: #242328;
}

.work-detail-wrapper {
  display: flex;
  height: @wrapper-height;
  justify-content: flex-start;
  flex-direction: column;
  padding: 0 20px;

  .image {
    width: 100%;
    height: auto;
    display: block;
    margin-top: 10px;
  }

  .img-info-wrapper {
    width: inherit;
    display: flex;
    margin: 20px 10px 0 10px;
    justify-content: flex-start;
    align-items: center;
  }

  .img-info-wrapper :last-child {
    margin-left: auto;
  }

  .im-toolbar {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    width: 100%;
    height: 120px;
    position: fixed;
    left: 0;
    bottom: 0;
    background-color: #2c2c31;
    border-top: 1px solid #2c2c31;
    z-index: 200;

    // border: 'none', backgroundColor: 'white', padding: '0 10px', borderRadius: '4px'

    .send-button {
      display: flex;
      width: auto;
      color: white;
      background-color: #762fc8;
      margin: 5px 20rpx 10px 0;
      padding: 5px 50px;
      border: none;
      border-radius: 50px;
    }
  }

  @keyframes rotate {
    from {
      transform: rotate(0deg);
    }

    to {
      transform: rotate(360deg);
    }
  }
}
